package myJs.myPkg.tabs

import japgolly.scalajs.react.CtorType.ChildArg
import japgolly.scalajs.react.callback.Callback
import japgolly.scalajs.react.{Children, JsFnComponent}
import myJs.Implicits.JDJAn
import slinky.readwrite.ObjectOrWritten

import scala.scalajs.js
import scala.scalajs.js.annotation.JSImport

/** Created by yz on 28/3/2022
  */

@JSImport("react-bootstrap", JSImport.Default)
@js.native
object ReactBootstrapTabs extends js.Object {

  val Tabs: js.Object = js.native

  val Tab: js.Object = js.native

}

object Tabs {

  case class Props(
      id: String,
      defaultActiveKey: js.UndefOr[String] = js.undefined,
      activeKey: String,
      onSelect: String => Unit,
      transition: Boolean = true
  )

  val Component = JsFnComponent[ObjectOrWritten[Props], Children.Varargs](ReactBootstrapTabs.Tabs)

  def apply(
      id: String,
      defaultActiveKey: js.UndefOr[String] = js.undefined,
      activeKey: String,
      onSelect: String => Callback,
      transition: Boolean = true
  )(children: ChildArg*) = {
    val useOnSelect=(v:String)=>onSelect(v).runNow()
    Component(
      Props(id, defaultActiveKey, activeKey, useOnSelect, transition)
    )(children: _*)
  }

}

object Tab {

  case class Props(
      eventKey: String,
      title: String,
      disabled: Boolean = false
  )

  val Component = JsFnComponent[ObjectOrWritten[Props], Children.Varargs](ReactBootstrapTabs.Tab)

  def apply(
      eventKey: String,
      title: String,
      disabled: Boolean = false
  )(children: ChildArg*) = {
    Component(
      Props(eventKey, title, disabled)
    )(children: _*)
  }

}
